<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>菜价单</title>
    <style>
        table {
            border-collapse: collapse; /* 合并单元格边框 */
            margin: 20px auto; /* 表格水平居中，上下留空 */
            text-align: center; /* 单元格文字居中 */
        }
        td {
            border: 1px solid #000; /* 单元格边框样式 */
            padding: 10px; /* 单元格内边距 */
            width: 100px; /* 单元格宽度 */
        }
        .title {
            font-size: 20px;
            font-weight: bold; /* 标题文字加粗 */
        }
    </style>
</head>
<body>
    <table>
        <!-- 第一行：合并3列显示“菜价单” -->
        <tr>
            <td colspan="3" class="title">菜价单</td>
        </tr>
        <!-- 第二行：表头（序号、菜名、菜价） -->
        <tr>
            <td>序号</td>
            <td>菜名</td>
            <td>菜价</td>
        </tr>
        <!-- 第三行：白菜信息 -->
        <tr>
            <td>1</td>
            <td>白菜</td>
            <td>3¥</td>
        </tr>
        <!-- 第四行：青菜信息 -->
        <tr>
            <td>2</td>
            <td>青菜</td>
            <td>3¥</td>
        </tr>
        <!-- 第五行：芹菜信息 -->
        <tr>
            <td>3</td>
            <td>芹菜</td>
            <td>3¥</td>
        </tr>
    </table>
</body>
</html>